<#include "../component/layout.html"/>
<@layout>
<div id="left-bar">
	<ul class="left-menu">
		<h2>玩搭配</h2>
		<li id="step0" class="sel">
			<a href="javascript:void(0);" clickcallback="imageBack">1. 选择模版</a>
		</li>
		<li id="step1">
			<a href="javascript:void(0);" clickcallback="imageTmplOk">2. 制作个性搭配</a>
		</li>
		<li>3. 发布上传</li>
	</ul>
</div>
<div id="middle">
	<div class="middle-container">
		<div class="image-container">
			<div class="default-image" >
				<span class="default-image-text">请选择一个模版</span>
			</div>
			<div id="image-baker" template-id="518" style="display:none;">
				<img img-id="" class="image-bg" >
				<div id="ele4" class="image-view" type=4 width=225 height=270 style="top: 0px; left: 10px; height: 270px; width: 225px;">
					<span class="image-view-text">上装</span>
				</div>                
 				<div id="ele0" class="image-view" type=0  width=200 height=215  style="top: -15px; left: 245px; height: 215px; width: 200px;">
					 <span class="image-view-text">包包</span>
				 </div>              
 				<div id="ele1" class="image-view" type=1  width=175 height=250  style="top: 145px; left: 150px; height: 250px; width: 175px;">
 					<span class="image-view-text">下装</span>
 				</div>                 
 				<div id="ele3" class="image-view" type=3 width=145 height=130  style="top: 240px; left: 320px; height: 130px; width: 145px;">
 					<span class="image-view-text">鞋子</span>
 				</div>              
				 <div id="ele5" class="image-view" type=5  width=155 height=155  style="top: 75px; left: 420px; height: 155px; width: 155px;">
					 <span class="image-view-text">配饰</span>
				 </div>             
			 </div>
		</div>
		<div class="dapei-reply dapei-submit-con">
			<div class="dapei-user-t">
				<div class="dapei-user-avatar">
					<img src="http://tp3.sinaimg.cn/2313454722/50/40014333341/0">
				</div>
				<div class="dapei-user-text">
					<div class="dapei-user-name">粉红小舞鞋</div>
				</div>
			</div>
			<div class="dapei-sina-tongbu">
				<input type="checkbox" checked="checked" id="tongbu"> 同步到新浪微博
			</div>
			<div class="dapei-user-input">
				<div class="lf">
					<textarea id="words" name="words"></textarea>
				</div>
				<span id="submit" class="dapei-reply-submit" clickcallback="imageSubmit">发布</span>
				<div class="cl"></div>
			</div>
		</div>
	</div>
</div>
<div id="right-toolbar">
	<div id="template-container">
		<ul class="template-menu">
			<li class="sel menu-item">
				<a href="/api/templet/100052">主题</a>
			</li>
			<#list templateMenus as templateMenu>
			<li class="menu-item">
				<a href="/api/templet/100052-${templateMenu.id}">${templateMenu.name}</a>
			</li>
			</#list>
		</ul>
		<div class="template-content">
			<div class="template-item-list">
				<div class="template" template-id="215">
					<div class="template-image">
						<img src="http://image.kokozu.net/template/20120910/1_1347256419551_small.jpg" alt="机车女孩">
					</div>
					<div class="template-title">机车女孩</div>
				</div>
				<div class="template" template-id="518">
					<div class="template-image">
						<img src="http://image.kokozu.net/template/20120917/1_1347869807580_small.jpg" alt="秋季潮流">
					</div>
					<div class="template-title">秋季潮流</div>
				</div>
				<div class="template" template-id="623">
					<div class="template-image">
						<img src="http://image.kokozu.net/template/20120920/1_1348128241379_small.jpg" alt="色彩堆叠">
					</div>
					<div class="template-title">色彩堆叠</div>
				</div>   
			</div>
			<div class="cl"></div>
			<div id="loading" class="loading"><p>正在加载中^_^</p></div>
		</div>
	</div>
	<div id="item-container" class="hidden" type-name="上衣" style="display: none;" view-id="2262" type-id="1">
		<ul class="item-menu" role="menu" menu-value="all" fixed="#right-toolbar">
			<li role="menu-item" menu-value="user" clickcallback="checkLogin_itemsTab">
				<a href="javascript:void(0);">我的上衣</a>
			</li>
			<li role="menu-item" menu-value="all" clickcallback="itemsTab" class="sel" menu-sel="true">
				<a href="javascript:void(0);">全部上衣</a>
			</li>
		</ul>
		<div class="item-content">
			<div class="item-list">
				<div class="item" item-id="10977">
					<div class="item-image" title="心脏嵌花羊绒衫" hovercallback="showUserItem" url="/item/10977?item=1">
						<img src="http://image.kokozu.net/item/20121019/1-5-0021_small.png" onload="imageCentralize(this,100,100);" alt="心脏嵌花羊绒衫" style="width: 81px; height: 100px; margin: 0px 0px 0px 9px;">
					</div>
				</div>
				<div class="item" item-id="9937">
					<div class="item-image" title="missselfridge修饰扇贝边背心 " hovercallback="showUserItem" url="/item/9937?item=1" in="0">
						<img src="http://image.kokozu.net/item/20120920/1_1348119858568_small.png" onload="imageCentralize(this,100,100);" alt="missselfridge修饰扇贝边背心 " style="width: 54px; height: 100px; margin: 0px 0px 0px 23px;">
					</div>
				</div>
				<div class="item" item-id="9943">
					<div class="item-image" title="missselfridge复古印花一字肩上衣" hovercallback="showUserItem" url="/item/9943?item=1">
						<img src="http://image.kokozu.net/item/20120920/1_1348121501240_small.png" onload="imageCentralize(this,100,100);" alt="missselfridge复古印花一字肩上衣" style="width: 97px; height: 100px; margin: 0px 0px 0px 1px;">
					</div>
				</div>
				<div class="item" item-id="8157">
					<div class="item-image" title="秋季休闲蝙蝠带帽长袖卫衣" hovercallback="showUserItem" url="/item/8157?item=1">
						<img src="http://image.kokozu.net/item/20120915/1-40100_small.png" onload="imageCentralize(this,100,100);" alt="秋季休闲蝙蝠带帽长袖卫衣" style="width: 90px; height: 100px; margin: 0px 0px 0px 5px;">
					</div>
				</div>
				<div class="item" item-id="8138">
					<div class="item-image" title="象牙图案的雪纺衬衫" hovercallback="showUserItem" url="/item/8138?item=1">
						<img src="http://image.kokozu.net/item/20120915/1-20304_small.png" onload="imageCentralize(this,100,100);" alt="象牙图案的雪纺衬衫" style="width: 75px; height: 100px; margin: 0px 0px 0px 12px;">
					</div>
				</div>
			</div>
			<div class="cl"></div>
			<!-- div id="loading" class="loading"><p>正在加载中^_^</p></div> -->
		</div>
	</div>
</div>
</@layout>
<script type="text/javascript">
$.koorz.getTemplate.init();
//$.koorz.dapei.init();
</script>